<template>
	<!--订单详情-地址+产品信息-->
	<view class="com-content" @tap.stop="todetail(obj.id)">
		<view class="com-top">
			<view class="com-top-l">
				<image class="icon-dz" :src="$mAssetsPath.icon_dizhi"></image>
			</view>
			<view class="com-top-r">
				<view class="com-top-r-l">
					<view class="com-top-r-top">
						<view class="com-top-r-top-l">{{obj.nickname || obj.user_name}}<text class="com-top-r-pho">{{obj.mobile}}</text></view>
						<view class="com-top-r-top-r" v-if="is_copy" @click="copy(obj.user_name,obj.mobile,obj.site)">复制</view>
					</view>
					<view class="com-top-r-address">
						<view>{{obj.site}}</view>
					</view>
				</view>
				<view class="icons icon-gengduo" v-if="!is_copy"></view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		name: "com-top",
		components: {},
		props: {
			obj: {
				type: Object,
				default () {
					return {
						name: '张三',
						mobile: '1347627347',
						address: '福建省厦门市湖里区吕玲路江头街道大儒世家119号',
					}
				}
			},
			page_type: {
				type: String,
				default: '1'
			},
			is_copy:{
				type:Boolean,
				default:false
			}
		},
		data() {
			return {

			}
		},
		methods: {
			todetail(id) {
				this.$emit("todetail", id)
			},
			copy(name,pho,address){
				let txt = name + pho + address
				uni.setClipboardData({
				    data: txt,
				    success: function (res) {
				        console.log(123,res);
				    }
				});
			}
		}
	}
</script>

<style lang="scss" scoped>
	.com-content {
		display: flex;
		flex-direction: column;
		width: 100%;
		padding: 20rpx 30rpx;

		.com-top {
			display: flex;
			align-items: center;
			background: #FFFFFF;
			box-shadow: 2rpx 2rpx 16rpx rgba(0, 0, 0, 0.07);
			border-radius: 10rpx;
			padding: 30rpx;
			.com-top-l {
				display: flex;
				justify-content: center;
				align-items: center;
				width: 64rpx;
				height: 64rpx;
				background: #198FFF;
				box-shadow: 0rpx 6rpx 12rpx rgba(25, 143, 255, 0.16);
				border-radius: 50%;
				margin-right: 30rpx;

				.icon-dz {
					width: 30rpx;
					height: 30rpx;

				}
			}

			.com-top-r {
				width: calc(100% - 95rpx);
				display: flex;
				justify-content: space-between;
				align-items: center;
				.com-top-r-l{
					width: 100%;
					.com-top-r-top {
						display: flex;
						justify-content: space-between;
						line-height: 40rpx;
						margin-bottom: 10rpx;
						.com-top-r-top-l {
								font-size: 32rpx;
								font-weight: 400;
								color: $font-color-3;
								.com-top-r-pho {
									margin-left: 20rpx;
									font-size: 28rpx;
									font-weight: 400;
									color: $font-color-9;
								}
							}
							.com-top-r-top-r {
								width: 70rpx;
								height: 36rpx;
								border: 1px solid #198FFF;
								border-radius: 4rpx;
								font-size: 20rpx;
								line-height: 34rpx;
								color: $font-color-b3;
								text-align: center;
							}
						
					}
					.com-top-r-address {
						font-size: 26rpx;
						font-weight: 400;
						color: $font-color-9;
						line-height: 36rpx;
						width: 100%;
					}
				}
			}
		}
	}
</style>
